<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>管理后台</title>
    <!-- Tell the browser to be responsive to screen width -->
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
    <link href="/favicon.ico" type="image/x-icon" rel="shortcut icon" />
    <!-- Bootstrap 3.3.4 -->
    <link href="/public/admin/css/bootstrap.min.css" rel="stylesheet">
    <link href="/public/admin/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
    <link href="/public/admin/css/plugins/bootstrap-table/bootstrap-table.min.css" rel="stylesheet">
    <link href="/public/admin/css/animate.css" rel="stylesheet">
    <link href="/public/admin/css/plugins/iCheck/custom.css" rel="stylesheet">
    <link href="/public/admin/css/style.css?v=4.0.0" rel="stylesheet">
    <link href="/public/admin/css/ratuo.css" rel="stylesheet">
    <!-- jQuery 2.1.4 -->
    <script src="/public/admin/js/jquery.min.js?v=2.1.4"></script>
    <script src="/public/admin/js/bootstrap.min.js?v=3.3.5"></script>
    <script src="/public/admin/js/myFormValidate.js"></script>
    <script src="/public/admin/js/common.js"></script>
    <script src="/public/admin/js/myAjax.js"></script>
    <script src="/public/admin/js/plugins/layer/layer.min.js"></script>
    <script src="/public/admin/js/jquery.validate.js"></script>
    <link href="/public/admin/css/plugins/iCheck/custom.css" rel="stylesheet">
    <script src="/public/admin/js/plugins/iCheck/icheck.min.js"></script>
    <!-- iCheck -->
    <script src="/public/admin/js/plugins/iCheck/icheck.min.js"></script>
</head>
<script type="text/javascript">
    $(document).ready(function(){
        $('.i-checks').iCheck({
            checkboxClass: 'icheckbox_square-green',
            radioClass: 'iradio_square-green'
        });
    });
</script>
<style>
    label {
        font-weight: normal;
    }
    ul.group-list {
        width: 96%;
        min-width: 1000px;
        margin: auto 5px;
        list-style: disc outside none;
    }
    ul.group-list li {
        white-space: nowrap;
        float: left;
        width: 150px;
        height: 25px;
        padding: 3px 5px;
        list-style-type: none;
        list-style-position: outside;
        border: 0px;
        margin: 0px;
    }
    th.title {
        background: #F3F3F3;
        border-bottom: 1px solid #D7D7D7;
        font-weight: bold;
        white-space: nowrap;
    }
    .table tbody tr th,.table tbody tr td{
        vertical-align :middle;
        text-align: center;
    }
</style>
<body>
<div class="wrapper">

    <section class="content">
        <div class="row">
            <div class="col-sm-12">
                <form action="{:url('Admin/Equipgroup/groupForm')}" id="roleform" method="post">
                    <input type="hidden" name="id" value="{$group_data['id']}">
                    <table class="table-condensed">
                        <tr class="b-group">
                            <th style="border-right: 1px solid #dedede;">
                                <label>
                                    选择不报警设备
                                </label>
                            </th>
                            <td>
                                {notempty name="equipment_list"}
                                    {volist name="equipment_list" id="c"}
                                        <label>
                                            &emsp;{$c['equipment']} <input class="i-checks"  type="checkbox" name="rule_ids[]" value="{$c['id']}" {if in_array($c['id'],$group_data['rules'])}checked="checked"{/if} >
                                        </label>
                                    {/volist}
                                {/notempty}
                            </td>
                        </tr>
                    </table>
                    <div class="page-bar">
                        <table>
                            <tr>
                                <td><label><input class="i-checks" id="all" type="checkbox">全部选中</label></td>
                                <td class="left"><a href="javascript:void(0)" onclick="roleSubmit()" class="btn btn-default">提交数据</a></td>
                                <td class="page-list"></td>
                            </tr>
                        </table>
                    </div>
                </form>
            </div>
        </div></section>
</div>
<script type="text/javascript">

    $('#all').on('ifChecked ifUnchecked', function(event){
        if(event.type == 'ifChecked' ){
            $('input[type=checkbox]').iCheck('check');
        }else{
            $('input[type=checkbox]').iCheck('uncheck');
        }
    });

    $(":checkbox[cka]").on('ifChecked ifUnchecked', function(event){
        $cks = $(this).parents('.b-group').first("input[type=checkbox]");
        if(event.type == 'ifChecked' ){
            $cks.iCheck('check');
        }else{
            $cks.iCheck('uncheck');
        }
    });

    function roleSubmit(){
        $.ajax({
            type : "POST",
            url:"{:url('Admin/Equipgroup/groupForm')}",
            data : $('#roleform').serialize(),
            success: function(v){
                var v =  eval('('+v+')');
                parent.layer.msg(v.msg, {icon: v.status,time: 1000});
                if(v.hasOwnProperty('status') && (v.status == 1)){
                    // window.location.href = location.href;
                    var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
                    parent.layer.close(index); //再执行关闭  
                }
            }
        });
        return false;
    }

</script>
</body>
</html>